<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <!--轮播图的css-->
    <link rel="stylesheet" href="css/swiper-bundle.min.css">
    <!--轮播图的js-->
    <script src="js/swiper-bundle.min.js"></script>
    <!--jquery的绝对路径-->
    <script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
    <!--首页的js-->
    <script src="js/index.js"></script>
    <!--首页的css-->
    <link rel="stylesheet" href="css/index.css">
    
</head>

<body>
    <!-- 头部模块 -->
    <div class="head">
        <div class="w nav">
            <div class="logo">
                <img src="images/logo.png" alt="">
            </div>
            <ul class="ul1">
                <li>
                    <a href="#" class="a or">首页</a>
                </li>
                <li>
                    <a href="cool_new.html" class="a">酷玩</a>
                </li>
                <li>
                    <a href="guid.html" class="a">导购</a>
                </li>
                <li>
                    <a href="public.html" class="a">试用</a>
                </li>
                <li>
                    <a href="report.html" class="a">报告</a>
                </li>
            </ul>
            <div class="right">
                <div class="big">
                    <div class="circle"></div>
                    <div class="bar"></div>
                </div>
                <div class="regest">
                    <a href="./regis.html">注册</a>
                </div>
            </div>
        </div>
    </div>
    <!-- 轮播图部分 -->
    <div class="swiper">
        <div class="swiper-wrapper">
            <div class="swiper-slide">
                <img src="images/next1.jpg" alt="">
            </div>
            <div class="swiper-slide">
                <img src="images/next2.jpg" alt="">
            </div>
            <div class="swiper-slide">
                <img src="images/next3.jpg" alt="">
            </div>
            <div class="swiper-slide">
                <img src="images/next4.jpg" alt="">
            </div>
            <div class="swiper-slide">
                <img src="images/next5.jpg" alt="">
            </div>
        </div>
        <!-- 如果需要分页器 -->
        <div class="swiper-pagination"></div>

        <!-- 如果需要导航按钮 -->
        <div class="swiper-button-prev"></div>
        <div class="swiper-button-next"></div>

        <!-- 如果需要滚动条 -->
        <!-- <div class="swiper-scrollbar"></div> -->
        <!-- 导航等组件可以放在Swiper容器之外 -->
    </div>
    <!-- 热门试用 -->
    <div class="w">
        <h3>热门试用</h3>
        <div class="item">
            <img src="images/hot1.jpg" alt="">
            <div class="down">
                <p>
                    巴穆达 The Toaster 烤面包机
                </p>
                <span class="span1">2022</span>
                <span class="span2">20台</span>
                <p class="p1"><span>1392</span>申请</p>
                <p class="p2">剩余时间2天</p>
                <div class="first">首发</div>
            </div>
        </div>
        <div class="item">
            <img src="images/hot2.jpg" alt="">
            <div class="down">
                <p>
                    Ospery小鹰户外运动专业包
                </p>
                <span class="span1 green">2022</span>
                <span class="span2 green">20台</span>
                <p class="p1"><span>1392</span>申请</p>
                <p class="p2 green">查看试用名单</p>
                <div class="first yellow">体验师专享</div>
            </div>
        </div>
        <div class="item">
            <img src="images/hot3.jpg" alt="">
            <div class="down">
                <p>
                    Liquid Image 338 眼镜
                </p>
                <span class="span1">2022</span>
                <span class="span2">20台</span>
                <p class="p1"><span>1392</span>申请</p>
                <p class="p2">剩余时间2天</p>
                <div class="first">首发</div>
            </div>
        </div>
        <div class="item">
            <img src="images/hot4.jpg" alt="">
            <div class="down">
                <p>
                    巴穆达 The Toaster 烤面包机
                </p>
                <span class="span1">2022</span>
                <span class="span2">20台</span>
                <p class="p1"><span>1392</span>申请</p>
                <p class="p2">剩余时间2天</p>
                <div class="first">首发</div>
            </div>
        </div>
    </div>
    <!-- 报告精选 -->
    <div class="report">
        <div class="w">
            <div class="more">
                查看更多 =
            </div>
            <h3 class="h3">报告精选</h3>
            <div class="item item2">
                <img src="images/rep1.jpg" alt="">
                <p>
                    空气净化器里面的学问多得惊呆你，你选对了吗？
                </p>
                <div class="susu">
                    <span class="cir"></span>
                    <span>苏苏</span>
                </div>
                <div class="like_marke">
                    <div class="like">
                        <span class="font12 palm">点赞3</span>
                        <span class="font12 palm">评论5</span>
                        <div class="bar1"></div>
                        <div class="bar2"></div>
                    </div>
                </div>
            </div>
            <div class="item item2">
                <img src="images/rep2.jpg" alt="">
                <p>
                    Redmi K50至尊版体验，小龙8+1.5k屏
                </p>
                <div class="susu">
                    <span class="cir"></span>
                    <span>苏苏</span>
                </div>
                <div class="like_marke">
                    <div class="like">
                        <span class="font12 palm">点赞3</span>
                        <span class="font12 palm">评论5</span>
                        <div class="bar1"></div>
                        <div class="bar2"></div>
                    </div>
                </div>
            </div>
            <div class="item item2">
                <img src="images/rep3.jpg" alt="">
                <p>
                    【小米MIX Fold2】金凡这人能处，你真喷他是真改啊！
                </p>
                <div class="susu">
                    <span class="cir"></span>
                    <span>苏苏</span>
                </div>
                <div class="like_marke">
                    <div class="like">
                        <span class="font12 palm">点赞3</span>
                        <span class="font12 palm">评论5</span>
                        <div class="bar1"></div>
                        <div class="bar2"></div>
                    </div>
                </div>
            </div>
            <div class="item item2">
                <img src="images/rep4.jpg" alt="">
                <p>
                    这手机，啥也不是[nothing phone(1)]！
                </p>
                <div class="susu">
                    <span class="cir"></span>
                    <span>苏苏</span>
                </div>
                <div class="like_marke">
                    <div class="like">
                        <span class="font12 palm">点赞3</span>
                        <span class="font12 palm">评论5</span>
                        <div class="bar1"></div>
                        <div class="bar2"></div>
                    </div>
                </div>
            </div>
            <div class="item item2">
                <img src="images/rep3.jpg" alt="">
                <p>
                    【小米MIX Fold2】金凡这人能处，你真喷他是真改啊！
                </p>
                <div class="susu">
                    <span class="cir"></span>
                    <span>苏苏</span>
                </div>
                <div class="like_marke">
                    <div class="like">
                        <span class="font12 palm">点赞3</span>
                        <span class="font12 palm">评论5</span>
                        <div class="bar1"></div>
                        <div class="bar2"></div>
                    </div>
                </div>
            </div>
            <div class="item item2">
                <img src="images/rep1.jpg" alt="">
                <p>
                    空气净化器里面的学问多得惊呆你，你选对了吗？
                </p>
                <div class="susu">
                    <span class="cir"></span>
                    <span>苏苏</span>
                </div>
                <div class="like_marke">
                    <div class="like">
                        <span class="font12 palm">点赞3</span>
                        <span class="font12 palm">评论5</span>
                        <div class="bar1"></div>
                        <div class="bar2"></div>
                    </div>
                </div>
            </div>
            <div class="item item2">
                <img src="images/rep2.jpg" alt="">
                <p>
                    Redmi K50至尊版体验，小龙8+1.5k屏
                </p>
                <div class="susu">
                    <span class="cir"></span>
                    <span>苏苏</span>
                </div>
                <div class="like_marke">
                    <div class="like">
                        <span class="font12 palm">点赞3</span>
                        <span class="font12 palm">评论5</span>
                        <div class="bar1"></div>
                        <div class="bar2"></div>
                    </div>
                </div>
            </div>
            <div class="item item2">
                <img src="images/rep3.jpg" alt="">
                <p>
                    【小米MIX Fold2】金凡这人能处，你真喷他是真改啊！
                </p>
                <div class="susu">
                    <span class="cir"></span>
                    <span>苏苏</span>
                </div>
                <div class="like_marke">
                    <div class="like">
                        <span class="font12 palm">点赞3</span>
                        <span class="font12 palm">评论5</span>
                        <div class="bar1"></div>
                        <div class="bar2"></div>
                    </div>
                </div>
            </div>

        </div>

    </div>
    <!-- 热门试用 -->
    <div class="w">
        <div class="more">
            查看更多 =
        </div>
        <h3>导购精选</h3>
        <div class="item">
            <img src="images/hot1.jpg" alt="">
            <div class="down">
                <p>
                    巴穆达 The Toaster 烤面包机
                </p>
                <span class="span1">2022</span>
                <span class="span2">20台</span>
                <p class="p1"><span>1392</span>申请</p>
                <p class="p2">剩余时间2天</p>
                <div class="first">首发</div>
            </div>
        </div>
        <div class="item">
            <img src="images/hot2.jpg" alt="">
            <div class="down">
                <p>
                    Ospery小鹰户外运动专业包
                </p>
                <span class="span1 green">2022</span>
                <span class="span2 green">20台</span>
                <p class="p1"><span>1392</span>申请</p>
                <p class="p2 green">查看试用名单</p>
                <div class="first yellow">体验师专享</div>
            </div>
        </div>
        <div class="item">
            <img src="images/hot3.jpg" alt="">
            <div class="down">
                <p>
                    Liquid Image 338 眼镜
                </p>
                <span class="span1">2022</span>
                <span class="span2">20台</span>
                <p class="p1"><span>1392</span>申请</p>
                <p class="p2">剩余时间2天</p>
                <div class="first">首发</div>
            </div>
        </div>
        <div class="item">
            <img src="images/hot4.jpg" alt="">
            <div class="down">
                <p>
                    巴穆达 The Toaster 烤面包机
                </p>
                <span class="span1">2022</span>
                <span class="span2">20台</span>
                <p class="p1"><span>1392</span>申请</p>
                <p class="p2">剩余时间2天</p>
                <div class="first">首发</div>
            </div>
        </div>
    </div>
    <!-- 报告精选 -->
    <div class="report">
        <div class="w">
            <div class="more">
                查看更多 =
            </div>
            <h3 class="h3">发现酷玩</h3>
            <div class="item item2">
                <img src="images/rep1.jpg" alt="">
                <p>
                    空气净化器里面的学问多得惊呆你，你选对了吗？
                </p>
                <div class="susu">
                    <span class="cir"></span>
                    <span>苏苏</span>
                </div>
                <div class="like_marke">
                    <div class="like">
                        <span class="font12 palm">点赞3</span>
                        <span class="font12 palm">评论5</span>
                        <div class="bar1"></div>
                        <div class="bar2"></div>
                    </div>
                </div>
            </div>
            <div class="item item2">
                <img src="images/rep2.jpg" alt="">
                <p>
                    Redmi K50至尊版体验，小龙8+1.5k屏
                </p>
                <div class="susu">
                    <span class="cir"></span>
                    <span>苏苏</span>
                </div>
                <div class="like_marke">
                    <div class="like">
                        <span class="font12 palm">点赞3</span>
                        <span class="font12 palm">评论5</span>
                        <div class="bar1"></div>
                        <div class="bar2"></div>
                    </div>
                </div>
            </div>
            <div class="item item2">
                <img src="images/rep3.jpg" alt="">
                <p>
                    【小米MIX Fold2】金凡这人能处，你真喷他是真改啊！
                </p>
                <div class="susu">
                    <span class="cir"></span>
                    <span>苏苏</span>
                </div>
                <div class="like_marke">
                    <div class="like">
                        <span class="font12 palm">点赞3</span>
                        <span class="font12 palm">评论5</span>
                        <div class="bar1"></div>
                        <div class="bar2"></div>
                    </div>
                </div>
            </div>
            <div class="item item2">
                <img src="images/rep4.jpg" alt="">
                <p>
                    这手机，啥也不是[nothing phone(1)]！
                </p>
                <div class="susu">
                    <span class="cir"></span>
                    <span>苏苏</span>
                </div>
                <div class="like_marke">
                    <div class="like">
                        <span class="font12 palm">点赞3</span>
                        <span class="font12 palm">评论5</span>
                        <div class="bar1"></div>
                        <div class="bar2"></div>
                    </div>
                </div>
            </div>
            <div class="item item2">
                <img src="images/rep3.jpg" alt="">
                <p>
                    【小米MIX Fold2】金凡这人能处，你真喷他是真改啊！
                </p>
                <div class="susu">
                    <span class="cir"></span>
                    <span>苏苏</span>
                </div>
                <div class="like_marke">
                    <div class="like">
                        <span class="font12 palm">点赞3</span>
                        <span class="font12 palm">评论5</span>
                        <div class="bar1"></div>
                        <div class="bar2"></div>
                    </div>
                </div>
            </div>
            <div class="item item2">
                <img src="images/rep1.jpg" alt="">
                <p>
                    空气净化器里面的学问多得惊呆你，你选对了吗？
                </p>
                <div class="susu">
                    <span class="cir"></span>
                    <span>苏苏</span>
                </div>
                <div class="like_marke">
                    <div class="like">
                        <span class="font12 palm">点赞3</span>
                        <span class="font12 palm">评论5</span>
                        <div class="bar1"></div>
                        <div class="bar2"></div>
                    </div>
                </div>
            </div>
            <div class="item item2">
                <img src="images/rep2.jpg" alt="">
                <p>
                    Redmi K50至尊版体验，小龙8+1.5k屏
                </p>
                <div class="susu">
                    <span class="cir"></span>
                    <span>苏苏</span>
                </div>
                <div class="like_marke">
                    <div class="like">
                        <span class="font12 palm">点赞3</span>
                        <span class="font12 palm">评论5</span>
                        <div class="bar1"></div>
                        <div class="bar2"></div>
                    </div>
                </div>
            </div>
            <div class="item item2">
                <img src="images/rep3.jpg" alt="">
                <p>
                    【小米MIX Fold2】金凡这人能处，你真喷他是真改啊！
                </p>
                <div class="susu">
                    <span class="cir"></span>
                    <span>苏苏</span>
                </div>
                <div class="like_marke">
                    <div class="like">
                        <span class="font12 palm">点赞3</span>
                        <span class="font12 palm">评论5</span>
                        <div class="bar1"></div>
                        <div class="bar2"></div>
                    </div>
                </div>
            </div>

        </div>

    </div>
    <!-- 点击加载更多 -->
    <div class="clickmore">
        <span class="dow"></span>
        &nbsp;点击加载更多
    </div>
    <!-- 底部部分 -->
    <footer>
        <div class="w hei">
            <div class="ewm">
                <img src="images/ewm.jpg" alt="">
            </div>
            <div class="footright">
                <dl class="log">
                    <dd><img src="images/logo.png" alt=""></dd>
                    <p>
                        全球酷玩试用导购平台酷新奇·好玩·品质
                    </p>
                    <p>
                        微信添加"JguoJguo"获取我们的服务
                    </p>
                </dl>
                <div class="dl">
                    <dl>
                        <dt>免费试用</dt>
                        <dd>试用流程</dd>
                        <dd>如何提高成功率</dd>
                        <dd>搜狐IT</dd>
                        <dd>关于极果</dd>
                        <dd>泡泡网</dd>
                    </dl>
                    <dl class="mt30">
                        <dt>友情链接</dt><br>
                        <dd>搜狐IT</dd>
                        <dd>泡泡网</dd>
                        <dd>智东西</dd>
                        <dd>搜狐IT</dd>
                        <dd>凤凰数码</dd>
                        <dd>关于极果</dd>
                        <dd>泡泡网</dd>

                    </dl>
                    <dl>
                        <dt>购买攻略</dt>
                        <dd>美亚海淘教程</dd>
                        <dd>搜狐IT</dd>
                        <dd>泡泡网</dd>
                        <dd>关于极果</dd>
                        <dd>日亚海淘教程</dd>
                    </dl>
                    <dl>
                        <dt>厂商合作</dt>
                        <dd>关于极果</dd>
                        <dd>搜狐IT</dd>
                        <dd>泡泡网</dd>
                        <dd>关于极果</dd>
                        <dd>关于极果</dd>
                        <dd>如何提高成功率</dd>
                    </dl>
                </div>
                <p class="copyright">
                    Copyright © 2022 极果 All rights reserved.
                </p>
            </div>
        </div>
    </footer>
</body>

</html>
<script>
    // 轮播图的script
    var mySwiper = new Swiper('.swiper', {
        direction: 'horizontal', // 垂直切换选项
        loop: true, // 循环模式选项

        // 如果需要分页器
        pagination: {
            el: '.swiper-pagination',
            clickable: true,
        },

        // 如果需要前进后退按钮
        navigation: {
            nextEl: '.swiper-button-next',
            prevEl: '.swiper-button-prev',
        },

        // 如果需要滚动条
        // scrollbar: {
        //     el: '.swiper-scrollbar',
        // },
        autoplay: {
            delay: 2000,
            stopOnLastSlide: false,//停在最后一张，在loop模式下不生效
            disableOnInteraction: true,//用户停留时停止轮播
        },
        effect: 'fade',
    })

</script>